<template>
	<template v-for="item in props.Data">
		<el-menu-item v-if='!item.Children' :index="item.Path">
			<el-icon>
					<component :is="item.Icon"></component>
				</el-icon>
				<!-- <component is="item.Icon"/> -->
				<!-- <i-ep-edit/> -->
				<!-- <el-icon>
					<IEpHomeFilled/>
				</el-icon> -->
			<template #title>
				{{item.Title}}
			</template>
		</el-menu-item>
		<el-sub-menu :index="item.Path" v-else>
			<template #title>
				<el-icon>
					<component :is="item.Icon"></component>
				</el-icon>
				<span>{{ item.Title }}</span>
			</template>
			<MenuTree :Data="item.Children"></MenuTree>
		</el-sub-menu>
	</template>
</template>
<script>
	export default{
		name:"MenuTree"
	}
</script>
<script setup>
	const props = defineProps({
	  Data: {
	    type: Array,
	    default: () => [],
	  },
	})
</script>

<style>
</style>